import Taro, { Component } from '@tarojs/taro'
import { View, Text, Image } from '@tarojs/components'
import './index.scss'
import request from '../../comment/request/request'
//确认下单页面
import { AtButton, AtAvatar, AtSearchBar, AtTag, AtTabBar, AtRate, AtIcon, AtTabs, AtTabsPane, AtBadge, AtFloatLayout, AtInputNumber, AtCheckbox ,AtToast } from 'taro-ui'
export default class Index extends Component {

  config = {
    navigationBarTitleText: '确认下单',
    navigationBarBackgroundColor: '#6381F7',
  
    navigationBarTextStyle: 'white'
  }

  constructor(props) {
    super(props)
    this.state = {
      value: '',
      juli: true,
      current: 0,
      isOpened: false,
      AtInputNumbervalue: 1,
      checkedList: ['list1'],
      icon_isOpened:false,
      spArr:[],
      alltotal:null,
      spList:{}
    }



    this.checkboxOption = [{
      value: 'list1',
      label: '武汉市XX区XX街道XX小区2栋1702',
      desc: '张三 17865421589'
    }]
  }

  componentWillMount() { 
   
    Taro.getStorage({ key: 'spList' })
    .then(res => {
      console.log(res.data,42)
      this.setState({
        spList:res.data,
        spArr:res.data.orderGoodsList,
        alltotal:res.data.alltotal
      })
    })
  }

  componentDidMount() { }

  componentWillUnmount() { }

  onAtSearchBar = () => {

  }

  onActionClick = () => {

  }
  onAtTag = () => {
    this.setState({
      juli: !this.state.juli
    })
  }

  onhandleClose = () => {
    this.setState({
      isOpened: false
    })
  }

  ondizhi = () => {
    this.setState({
      isOpened: true
    })
  }

  onAtCheckbox (value) {
    this.setState({
      checkedList: value
    })
  }

  onaddress = () => {
    Taro.navigateTo({
      url: '../index.3/index'
    })
  }

  onorder = () => {
    this.setState({
      icon_isOpened:true
    })
  }

  onAtToast = () => {
    request._post(`/zhrq-web/gas/order/insertOrder`, {...this.state.spList}).then(res => {
      //新增订单
      if (res.rc === 0) {
        Taro.navigateTo({
          url: '../index/index'
        })
      }
    })
   

  }




  render() {

    var height
    wx.getSystemInfo({
      success: function (res) {
        console.log(res)
        height = res.screenHeight - 130 + 'px'
      }
    })
    console.log(this.state.spArr)
    return (
      <View className='index'>

      <AtToast  isOpened={this.state.icon_isOpened} text="下单已成功, 请等待配送信息, 请到“订单”查阅" icon={"check-circle"} onClose={this.onAtToast}></AtToast>

        <AtFloatLayout isOpened={this.state.isOpened} onClose={this.onhandleClose} scrollY={true} >
          <View className='AtFloatLayout_t'>
            <Text>选择收获地址</Text>
          </View>
          <AtCheckbox
            options={this.checkboxOption}
            selectedList={this.state.checkedList}
            onChange={this.onAtCheckbox.bind(this)}
          />
           <View className='AtFloatLayout_t' onClick={this.onaddress}>
           <AtIcon value='add-circle' size='20' color='#FFDF25'></AtIcon><Text>新增收获地址</Text>
          </View>
        </AtFloatLayout>

        <View className='dizhi' onClick={this.ondizhi}>
          <Text>选择收获地址</Text><AtIcon value='chevron-right' ></AtIcon>
        </View>

        <View className='order'>
          <View className='gas'>
            <Text>#1燃气站</Text>
          </View>
          {
            this.state.spArr &&
            this.state.spArr.map((item) => {
              return (
                <View className='list_item'>
                <View className='item_L'>
                  <Image
                    className='Image'
                    src='https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1759133402,2696021330&fm=26&gp=0.jpg'
                  />
                </View>
                <View className='item_R'>
                  <View className='item_t'>
                    <View className='rqz'>
                      <Text >{item.goods.goodsName}</Text>
                    </View>
                    <View className='juli'>
                      <Text >¥ {item.goods.price}</Text>
                    </View>
                  </View>
                  <View className='item_m'>
                    <View>
                      <Text>X{item.num}</Text>
                    </View>
                  </View>
    
    
                </View>
              </View>
              )
            })
          }
         
      
        </View>

        <View className='footer' >
          <View className='fonter_L'>
            <Text className='gong'>共{this.state.spArr.length}件</Text><Text className='total'>合计</Text><Text>¥{this.state.alltotal}</Text>
          </View>
          <View className='fonter_R' onClick={this.onorder}>
            <Text>确认下单</Text>
          </View>
        </View>

      </View>
    )
  }
}

